import './reactRoute.css';
import React from 'react';
import { Link } from 'react-router-dom';


class ReactRoute extends React.Component{
  constructor(props){
    super(props);
    this.divscrollFn = this.divscrollFn.bind(this);
    this.arr = [1,2,3,4,5]
  }
  divscrollFn(event){
    let el=event.target;
    if(el.scrollTop+el.clientHeight>=el.scrollHeight-1){
       console.log('到底啦');
    };
  }
  render (){
    return <div>
            <div>
                <div className='BOX' onScroll={this.divscrollFn}>
                    <ul>
                      {this.arr.map((post,ind) =>
                        <li key={ind}>
                          {post}
                        </li>
                      )}
                    </ul>
                </div>

              <Link to='/Myhome' style={{color:'black'}}>
                <p>点击跳转Myhome</p>
              </Link>
              <Link to='/' style={{color:'black'}}>
                <p>点击跳转ReactRoute</p>
              </Link>
              <Link to='/TestClass' style={{color:'black'}}>
                <p>点击跳转TestClass</p>
              </Link>
              <Link to='/RoutePage' style={{color:'black'}}>
                <p>点击跳转RoutePage</p>
              </Link>
              <Link to='/RoutePages' style={{color:'black'}}>
                <p>点击跳转RoutePages</p>
              </Link>
            </div>
    </div>
  }

}
export default ReactRoute;